<!DOCTYPE html>
<html lang="en" ng-app="app">
<head>
    <meta charset="UTF-8">
    <title></title>
    <link href="../app/bower_components/bootstrap/dist/css/bootstrap.css" rel="stylesheet">
</head>
<body>
<high-than-ctrl></high-than-ctrl>
<div ng-controller="AppController" high-than-ctrl>
    <ab>
        <cd></cd>
    </ab>
</div>

<script src="../app/bower_components/jquery/dist/jquery.js"></script>
<script src="../app/bower_components/angular/angular.js"></script>

<script>
    var app = angular.module('app', []);
    app.controller('AppController', function ($scope) {

    });
    app.directive('ab', makeDirective('ab', {templateUrl: 'template/directive-proirity.html', transclude: true}));
    app.directive('cd', makeDirective('cd'));
    app.directive('ef', makeDirective('ef'));
    app.directive('highThanCtrl',
            function () {
                return {
                    priority: 1000,
                    link: function ($scope) {
                        console.log($scope.$id);
                    }
                }
            }
    );

    function makeDirective(name, local) {
        return function () {
            return angular.extend({
                restrict: 'ACE',
                compile: function (element, attrs) {
                    console.log(name);
                    return function () {
                        console.log(name + ' post link');
                    }
                }
            }, local);
        }
    }

</script>
</body>
</html>